<template>
	<div class="cun-she-ju">
		<div class="search">
			<el-form label-width="auto" inline>
				<el-form-item label="关键字">
					<el-input placeholder="搜索内容">
						<template #append>
							<el-button class="s-btn" color="#8A1313">
								<template #icon> <IEpSearch /> </template>
							</el-button>
						</template>
					</el-input>
				</el-form-item>
			</el-form>
		</div>

		<div class="list">
			<div class="box" v-for="(item, index) in list" :key="index">
				<el-image class="cover" src="https://sms-1302634640.file.myqcloud.com/cloud-jingzhu/xiangye/img1.png?imageMogr2/thumbnail/750x" fit="cover" />
				<div class="info">
					<div class="title">{{ item.name }}</div>
					<div class="content">
						{{ item.content }}
					</div>
					<!-- <span>电话：1111111111111111</span>
					<span>地址：xxxxxxxxxxxxxxxxxxx</span> -->
					<el-button class="btn" color="#8A1313">了解更多 </el-button>
				</div>
			</div>
		</div>
	</div>
</template>
<script setup lang="ts" name="NongJiaLe">
const list = [
	{
		name: "观风度假山庄",
		content: `观风度假山庄于2022年6月30日开业，酒店距离武隆火车站约31km。酒店客房装饰考究，设施齐全，配备空调。周到的服务和一流的设施，会让您在仙女山开启一段难忘的旅程。
        预订电话：13996759532  蔡先生`,
		img: ""
	},
	{
		name: "好院子民宿",
		content: `仙女山·归原·好院子民宿位于重庆市武隆区仙女山街道荆竹村水竹坪组68号（归原小镇内），拥有客房十余间，配备接待厅、啤酒吧、茶室、
        艺术展厅等配套设施，院内包括房间无线Wi-Fi全覆盖，房间内配备空调和地暖等。仙女山·归原·好院子民宿隶属于...
        预订电话：18617043690  张先生
        民宿地址：重庆市武隆区仙女山街道荆竹村水竹坪组68号归原小镇1号楼`,
		img: ""
	},
	{
		name: "荆竹村图作缘民宿",
		content: `荆竹村图作缘民宿位于仙女山街道荆竹村杨柳组47号，该民宿秉持着“如果你厌倦了喧嚣都市里的索然无味，如果你的心中还有着对远方的向往。
        你不用走太远，来仙女山图作缘民宿就可以实现你的愿望”为目标。装修温馨的卧室，原生态的设计以及原木...
        预订电话：18983337333`,
		img: ""
	},
	{
		name: "闲适园民宿",
		content: `闲适园民宿位于荆竹村杨柳村民小组，周边有“寻梦园”“葡萄仙坛”等果园3家、农家乐8家、民宿5家，房间16个，35个床位，包吃住1800人/月。
        预订电话：18581221757  杨先生`,
		img: ""
	}
];
</script>
<style lang="scss" scoped>
.cun-she-ju {
	padding: 40px 320px;
	.search {
		display: flex;
		margin-top: 40px;
		font-size: 20px;
		color: #000000;
		.s-btn {
			color: #ffffff;
			background-color: #8a1313;
		}
	}
}
.list {
	.box {
		display: flex;
		margin-top: 40px;
		.cover {
			width: 564px;
			height: 376px;
		}
		.info {
			display: flex;
			flex: 1;
			flex-direction: column;
			padding-left: 40px;
			.title {
				font-size: 36px;
				font-weight: bold;
				color: rgb(25 25 25 / 100%);
			}
			.content {
				min-height: 160px;
				margin: 40px 0;
				font-size: 16px;
				color: rgb(102 102 102 / 100%);
			}
			.btn {
				width: 116px;
			}
		}
	}
}
</style>
